<!--
 * 楼栋表
 * @author ZhuanZ（无密码）
 * @date 2025-01-10
 * 开源项目：https://gitee.com/lgx1992/lg-soar 求star！请给我star！请帮我点个star！
-->
<template>
  <table-container>
    <lg-table :schema="schema" v-bind="tableProps">
      <!-- 工具栏 -->
      <template #toolbar-left>
        <lg-button-list :limit="$ToolBtnLimit">
          <btn-tool-add v-if="has('create')" @click="editRef.open()" />
          <btn-tool-remove v-if="has('remove')" @click="remove()" />
          <btn-tool-export v-if="has('export')" @click="exports" />
          <btn-tool-import v-if="has('import')" @click="imports" />
          <template #trigger><btn-tool-more /></template>
        </lg-button-list>
      </template>
      <!-- 操作栏 -->
      <template #actionbar="{ row }">
        <lg-button-list :limit="$RowBtnLimit">
          <btn-row-view @click="detailRef.open(row)" />
          <btn-row-update v-if="has('update')" @click="editRef.open({ id: row.id })" />
          <btn-row-remove v-if="has('remove')" @click="remove(row.id)" />
        </lg-button-list>
      </template>
      <!-- 插槽 -->
    </lg-table>
    <edit ref="editRef" @ok="reload()" />
    <detail ref="detailRef" />
  </table-container>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { TableContainer } from '@/components';
import { useAuth, useTable, LgTable, LgButtonList } from '@/soar';
import api from './api';
import schema from './schema';
import Edit from './Edit.vue';
import Detail from './Detail.vue';

const { has } = useAuth();
const editRef = ref();
const detailRef = ref();

// 使用表格
const { exports, imports, remove, reload, tableProps } = useTable<any>({
  api,
  props: {
    orderBys: ['id'],
    actionbar: {
      width: 100,
    },
  },
});
</script>
